<template lang="html">
  <div>
    <p>卢布汇率：1卢布 -> 0.1028人民币，1人民币 -> 9.7297卢布</p>
    <div class="wrapper">
      <h3>克里姆林宫</h3>
      <el-table
        :data="tableData"
        border
        >
        <el-table-column
          prop="place"
          label="景点"/>
        <el-table-column
          prop="price1"
          label="门票(现场)"/>
        <el-table-column
          prop="price2"
          label="飞猪订票(预定)"/>
      </el-table>
    </div>
    <div class="wrapper">
      <h3>国家历史博物馆</h3>
      <el-table
        :data="tableData2"
        border
        >
        <el-table-column
          prop="place"
          label="景点"/>
        <el-table-column
          prop="price1"
          label="门票(现场)"/>
        <el-table-column
          prop="price2"
          label="飞猪订票(预定)"/>
        <el-table-column
          prop="price3"
          label="携程订票(预定)"/>
      </el-table>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      tableData: []
    }
  },
  methods: {
    init() {
      this.tableData = [
        {
          place: '门票（包含教堂）',
          price1: '500卢布 -> 51.3人民币',
          price2: '68人民币',
        },
        {
          place: '武器库',
          price1: '700卢布 -> 71.9人民币',
          price2: '90人民币',
        }
      ]

      this.tableData2 = [
        {
          place: '门票',
          price1: '350卢布 -> 35.97人民币',
          price2: '98人民币',
          price3: '84人民币'
        },
      ]
    }
  },
  mounted() {
    this.init()
  }
}
</script>

<style lang="scss" scoped>
  .wrapper {
    width: 600px;
    margin: 10px;
    h3 {
      margin-bottom: 10px;
    }
  }
</style>
